<!--
 Copyright (c) 2017,2018,2019,2020,2021,2022 Klaus Landsdorf (http://node-red.plus/)
 All rights reserved.
 node-red-contrib-modbus - The BSD 3-Clause License

 @author <a href="mailto:klaus.landsdorf@bianco-royal.de">Klaus Landsdorf</a> (Bianco Royal)
-->
<script type="text/javascript">
  RED.nodes.registerType('modbus-response-filter', {
    category: 'modbus',
    color: '#E9967A',
    defaults: {
      name: {value: ''},
      filter: {value: ''},
      registers: {value: 0, validate: RED.validators.number()},
      ioFile: {value: '', type: 'modbus-io-config', required: true},
      filterResponseBuffer: {value: true},
      filterValues: {value: true},
      filterInput: {value: true},
      showStatusActivities: {value: false},
      showErrors: {value: false},
      showWarnings: {value: true},
    },
    inputs: 1,
    outputs: 1,
    align: "left",
    icon: 'modbus.png',
    paletteLabel: 'Modbus-Response-Filter',
    label: function () {
      return this.name || this.filter || 'Modbus Response Filter'
    },
    oneditprepare: function () {
      let node = this

      let tabs = RED.tabs.create({
        id: "node-input-modbus-tabs",
        onchange: function (tab) {
          $("#node-input-tabs-content").children().hide()
          $("#" + tab.id).show()
        }
      })

      tabs.addTab({
        id: "modbus-settings-tab",
        label: this._("modbus-contrib.tabs-label.settings")
      })

      tabs.addTab({
        id: "modbus-options-tab",
        label: this._("modbus-contrib.tabs-label.options")
      })

      let lookupButton = $('#node-filter-lookup-button')
      let lookupField = $('#node-input-filter')

      lookupButton.click(function () {
        lookupButton.addClass('disabled')

        $.getJSON('modbus/iofile/valuenames', function (configData) {
          lookupButton.removeClass('disabled')
          node.configData = []

          $.each(configData, function (i, entry) {
            node.configData.push(entry.name)
          })

          lookupField.autocomplete({
            source: node.configData,
            minLength: 0,
            close: function (event, ui) {
              lookupField.autocomplete('destroy')
            }
          }).autocomplete('search', '')
        })
      })
    }
  })
</script>


<script type="text/x-red" data-template-name="modbus-response-filter">
    <div class="form-row">
        <ul style="background: #fff; min-width: 600px; margin-bottom: 20px;" id="node-input-modbus-tabs"></ul>
    </div>
    <div id="node-input-tabs-content" style="min-height: 170px;">
        <div id="modbus-settings-tab" style="display:none">
            <div class="form-row">
                <label for="node-input-name"><i class="icon-tag"></i> <span data-i18n="node-red:common.label.name"></span></label>
                <input type="text" id="node-input-name" placeholder="Name">
            </div>
            <div class="form-row">
                <label for="node-input-filter"><i class="fa fa-filter"></i> <span data-i18n="modbus-contrib.label.filter"></span></label>
                <input type="text" id="node-input-filter" style="width:60%;" placeholder="">
                <a id="node-filter-lookup-button" class="red-ui-button"><i id="node-filter-lookup-button-icon" class="fa fa-search"></i></a>
            </div>
            <div class="form-row">
                <label for="node-input-registers"><i class="fa fa-filter"></i> <span data-i18n="modbus-contrib.label.registers"></span></label>
                <input type="text" id="node-input-registers" placeholder="0">
            </div>
            <div class="form-row">
                <label for="node-input-ioFile"><i class="icon-file"></i> <span data-i18n="modbus-contrib.label.ioFile"></span></label>
                <input type="text" id="node-input-ioFile">
            </div>
            <hr>
            <div class="form-row">
                <label style="min-width:190px" for="node-input-filterResponseBuffer"><i class="fa fa-filter"></i> <span
                data-i18n="modbus-contrib.label.filterResponseBuffer"></span></label>
                <input type="checkbox" id="node-input-filterResponseBuffer" style="max-width:30px">
            </div>
            <div class="form-row">
                <label style="min-width:190px" for="node-input-filterValues"><i class="fa fa-filter"></i> <span
                data-i18n="modbus-contrib.label.filterValues"></span></label>
                <input type="checkbox" id="node-input-filterValues" style="max-width:30px">
            </div>
            <div class="form-row">
                <label style="min-width:190px" for="node-input-filterInput"><i class="fa fa-filter"></i> <span
                data-i18n="modbus-contrib.label.filterInput"></span></label>
                <input type="checkbox" id="node-input-filterInput" style="max-width:30px">
            </div>
        </div>
        <div id="modbus-options-tab" style="display:none">
            <div class="form-row">
                <label style="min-width:190px" for="node-input-showStatusActivities"><i class="fa fa-th"></i> <span
                data-i18n="modbus-contrib.label.showActivities"></span></label>
                <input type="checkbox" id="node-input-showStatusActivities" style="max-width:30px">
            </div>
            <div class="form-row">
                <label style="min-width:190px" for="node-input-showErrors"><i class="fa fa-th"></i> <span
                data-i18n="modbus-contrib.label.showErrors"></span></label>
                <input type="checkbox" id="node-input-showErrors" style="max-width:30px">
            </div>
            <div class="form-row">
                <label style="min-width:190px" for="node-input-showWarnings"><i class="fa fa-th"></i> <span
                data-i18n="modbus-contrib.label.showWarnings"></span></label>
                <input type="checkbox" checked id="node-input-showWarnings" style="max-width:30px">
            </div>
        </div>
    </div>
</script>


<script type="text/x-red" data-help-name="modbus-response-filter">
    <p>
        Modbus Response Filter
    </p>

    <p>The Response Filter is to work with an IO-File to filter values out of an IO-Payload by name.</p>

    <p>Deploy first to use the lookup button! You need a working IO-File-Config for the lookup.</p>
</script>
